<!-- 11.02 假拼团（活动，邀请好友领金币） 商品转发使用线上价购买 -->
<template>
	<view class="">
		<view class="ytop"
			:style="{'background-image': 'url(' + imgprefix+'/web/uploads/logo/bg.png?timeout='+timeout + ')'}">
			<!-- <view class="reason">
				{{sharecon.sharedetai != '' ? sharecon.sharedetai : '为什么不转发呢？因为低质量的 要面子，不如高质量的省钱，省 下来的钱可以让自己更自信。'}}
			</view> -->
			<!-- <view class="reline"></view> -->
			<view class="rebtn">
				<button class="strsbtn coffeebg" open-type="share">
					<view class="">
						点击此按钮分享{{sharecon.sharenum}}个好友
						<!-- <text class="butbtn"></text> -->
					</view>
					<view class="">
						即可享受线上成交价。
					</view>
					<view class="butshare">点击转发>>></view>
				</button>
			</view>
			<!-- <view class="fornums dir-left-nowrap cross-center"> -->
			<view class="fornum whitebg">
				<!-- <view class="dir-left-nowrap main-center cross-center"> -->
				<view class="">
					已转发：{{forwarded}}人
				</view>
				<!-- <view class="refresh whitebg" @click="taskshare(1)">
						刷新
					</view>
				</view> -->
				<view class="dir-left-nowrap main-center cross-center">
					<view class="">
						还剩：{{sharecon.sharenum - forwarded}}人
					</view>
					<view class="refresh whitebg" @click="taskshare(1)">
						刷新
					</view>
				</view>
			</view>
			<!-- <view class="refresh whitebg">
				刷新
			</view> -->
			<!-- </view> -->
		</view>
		<!-- <view class="ytop">
			<view class="yaoqing">
				分享好友使用线上成交价
			</view>
			<button class="share-friend" open-type="share">分享{{sharecon.sharenum}}个好友使用线上成交价</button>
			<view class="" v-if="issuc">
				任务已完成，使用线上成交价
			</view>
			<view class="" v-else>
				任务正在进行中
			</view>
		</view> -->
	</view>
</template>

<script>
	import {
		mapState,
		mapGetters
	} from "vuex";
	let mallurl = null
	export default {
		data() {
			return {
				like_list: null,
				issuc: false,
				inimg: '',
				// 11.12 分享 信息 商品id
				sharecon: '',
				forwarded: 0,
				goodsharepic: '',
				goodsharetitle: '',
				goodsid: 0,
				mall_id: 1,
				malltype: 0,
				imgprefix: this.$siteInfo.imgroot,
				timeout: new Date().getTime(),
			}
		},
		onLoad(options) {
			// 11.12 分享信息
			if (options.sharecon) {
				this.sharecon = JSON.parse(options.sharecon)
			}
			if (options.goodsharepic && options.goodsharepic != '') {
				this.goodsharepic = options.goodsharepic
			}
			if (options.goodsharetitle && options.goodsharetitle != '') {
				this.goodsharetitle = options.goodsharetitle
			}
			this.mall_id = options.mall_id || 1
			mallurl = this.$siteInfo.apiroot + '?_mall_id=' + this.mall_id + '&r='
			// 11.12 分享 商品id
			if (options.goodsid) {
				this.goodsid = options.goodsid
			}
			// 11.12 查看分享结果
			this.taskshare(1)
			this.imgReq()
			// this.tasksu()
		},
		computed: {
			...mapGetters('mallConfig', {
				getTheme: 'getTheme',
			}),
			...mapState({
				userInfo: state => state.user.info,
				storemall: state => state.malid.apimaUrl
			}),
		},
		methods: {
			// 11.12 分享使用便宜价格购买商品
			taskshare(id) {
				let data = {
					type: 5,
					targetid: this.goodsid,
					userid: this.userInfo.options.user_id
					// test: 1 
				}
				if (id == 1) {
					data.querystate = 1
				}
				let url = this.$api.gold.index
				if (this.mall_id > 1) {
					// url = this.storemall.gold.index
					url = mallurl + this.$apiUrl.gold.index
				}
				this.$request({
					url: url,
					data: data
				}).then((res) => {
					this.malltype = res.data.malltype
					if (res.data.isdone == 1) {
						this.issuc = true
						this.forwarded = this.sharecon.sharenum
					} else {
						this.issuc = false
						this.forwarded = res.data.num
					}
				}).catch(() => {

				})
			},
			tasksu() {
				let url = this.$api.gold.index
				if (this.mall_id > 1) {
					url = mallurl + this.$apiUrl.gold.index
				}
				this.$request({
					url: url,
					data: {
						type: 4,
						querystate: 1,
						targetid: 1,
						userid: this.userInfo.options.user_id
					}
				}).then((res) => {
					if (res.data.isdone === 1) {
						this.issuc = true
					} else {
						this.issuc = false
					}
				}).catch(() => {

				})
			},
			imgReq() {
				let url = this.$api.navs.list
				if (this.mall_id > 1) {
					url = mallurl + this.$apiUrl.navs.list
				}
				this.$request({
					url: url,
					data: {
						pid: 276,
						status: 1
					}
				}).then((res) => {
					this.inimg = res.data.list[0].icon_url
				}).catch(() => {

				})
			},
		},
		onShareAppMessage() {
			// 11.12 点击分享按钮分享人数加一 （假数据）
			// this.taskshare()
			let params = {
				useridres: this.userInfo.options.user_id, // 真分享 用户id
				targoodsid: this.goodsid, // 真分享 商品id
				mallid: this.mall_id
			}
			if (this.malltype == 1 || this.malltype == 2 || this.malltype == 3) {
				params = {
					useridres: this.userInfo.options.user_id, // 真分享 用户id
					targoodsid: this.goodsid, // 真分享 商品id
					mallid: this.mall_id,
					mall_id: this.mall_id
				}
			}
			return this.$shareAppMessage({
				// title: this.config.share_title ? this.config.share_title : '双熙堂珠宝',
				// imageUrl: this.config.share_pic,
				title: this.goodsharetitle != '' ? this.goodsharetitle : '双熙堂：源自1865年皇家翡翠工匠',
				imageUrl: this.goodsharepic != '' ? this.goodsharepic : this.inimg,
				path: this.malltype == 1 || this.malltype == 2 || this.malltype == 3 ? '/pages/entity/index' :
					'/pages/index/index',
				params: params
				// params: {
				// 	// useridshgold: this.userInfo.options.user_id
				// }
			});
		},
	}
</script>

<style scoped lang="scss">
	.ytop {
		background: #FFFFFF;
		// height: 450rpx;
		width: 100%;
		height: 100vh;
		font-size: 32rpx;
		text-align: center;
		// padding: 42rpx 0;
		color: #FFFFFF;
		background-size: 100% 100%;
	}

	.reason {
		color: #945a21;
		font-size: 36rpx;
		line-height: 60rpx;
		width: 604rpx;
		max-height: 416rpx;
		overflow: hidden;
		margin: 0 auto;
		font-weight: bold;
		text-align: justify;
		padding-top: 180rpx;
	}

	.reline {
		// position: absolute;
		// top: 492rpx;
		margin-top: 24rpx;
		background-color: #945a21;
		width: 100%;
		height: 2rpx;
		// border: 1rpx solid #945a21;
	}

	.rebtn {
		width: 715rpx;
		// width: 604rpx;
		// border: 1rpx solid #945a21;
		// color: #945a21;
		// height: 180rpx;
		// margin: 24rpx auto;
		margin: 0 auto;
		padding-top: 324rpx;
		// position: absolute;
		// top: 516rpx;
		// left: 72rpx;
		font-size: 36rpx;
		// padding: 32rpx 42rpx;
		text-align: justify;
		font-weight: lighter;
	}

	.strsbtn {
		background: none;
		// color: #945a21;
		margin: 0;
		// padding: 0;
		padding: 32rpx 42rpx;
		line-height: 54rpx;
		text-align: justify;
		font-weight: lighter;
		letter-spacing: 5rpx;
	}

	.butbtn {
		border-radius: 8rpx;
		color: #FFFFFF;
		font-size: 42rpx;
		font-weight: 600;
	}

	.butshare {
		text-align: right;
	}

	.coffeebg {
		background-color: #945a21;
		color: #FFF;
		border-radius: 36rpx;
	}

	.whitebg {
		background-color: #FFF;
		color: #945a21;
		border: 1rpx solid #945a21;
	}

	.strbtn {
		background-color: #945a21;
	}

	.fornums {
		margin: 84rpx auto;
	}

	.fornum {
		border-radius: 25rpx;
		font-size: 36rpx;
		// width: 325rpx;
		width: 427rpx;
		// height: 137rpx;
		height: 177rpx;
		// color: #FFFFFF;
		// margin: 24rpx auto;
		margin: 84rpx auto;
		// position: absolute;
		// top: 720rpx;
		// left: 50%;
		// transform: translateX(-50%);
		// padding: 16rpx 0;
		padding: 36rpx 0;
		text-align: center;
		letter-spacing: 5rpx;
	}

	.refresh {
		width: 102rpx;
		height: 52rpx;
		font-size: 26rpx;
		letter-spacing: 5rpx;
		text-align: center;
		line-height: 52rpx;
	}

	.yaoqing {
		text-align: center;
		font-size: 64rpx;
		color: #FFFFFF;
		padding: 32rpx;
		text-shadow: 0 0 10rpx #ffb4a3;
		line-height: 200rpx;
		// f6b6a8 ea470c

	}

	.share-friend {
		text-align: center;
		background: none;
		color: #FFFFFF;
		width: 456rpx;
		background-color: #f8961f;
	}
</style>
